<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
       xmlns:h="http://java.sun.com/jsf/html"
       xmlns:f="http://java.sun.com/jsf/core"
       xmlns:c="http://java.sun.com/jsp/jstl/core">
    <h:head>
        <title>Registreer</title>
        <h:outputStylesheet library="css" name="styles/style.css"  />
        <link rel="stylesheet" type="text/css" href="styles/style.css" />
    </h:head>
    <h:body>
        <div id="content">
            <div id="main">
            <h:form>
                <h:outputLabel for="achternaam">Achternaam</h:outputLabel>
                <h:inputText id="naam" value="#{klantController.achternaam}" size="50" required="true"></h:inputText>
                <br/>
                <h:outputLabel for="voornaam">Voornaam</h:outputLabel>
                <h:inputText id="voornaam" value="#{klantController.voornaam}" size="50" required="true"></h:inputText>
                <br/>
                <h:outputLabel for="adres">Adres</h:outputLabel>
                <h:inputText id="adres" value="#{klantController.adres}" size="50" required="true"></h:inputText>
                <br/>
                <h:outputLabel for="postcode">Postcode</h:outputLabel>
                <h:selectOneMenu value="#{klantController.postcodeString}">
                    <f:selectItems value="#{postcodeController.postcodes}" var="y"
                                   itemLabel="#{y.naam}" itemValue="#{y.postcode}" />
                </h:selectOneMenu>
                <br/>
                <h:outputLabel for="telefoon">Telefoon</h:outputLabel>
                <h:inputText id="telefoon" value="#{klantController.telefoon}" size="30"></h:inputText>
                <br/>
                <h:outputLabel for="email">Email</h:outputLabel>
                <h:inputText id="email" value="#{klantController.email}" size="50" required="true"></h:inputText>
                <br/>
                <h:outputLabel for="username">Gebruikersnaam</h:outputLabel>
                <h:inputText id="username" value="#{klantController.username}" size="50" required="true"></h:inputText>
                <br/>
                <h:outputLabel for="password">Wachtwoord</h:outputLabel>
                <h:inputSecret id="password" value="#{klantController.password}" size="50" required="true"></h:inputSecret>
                <br/>
                <h:commandButton value="Submit" action="#{klantController.steekInDatabase}"/>
            </h:form>  
                
            </div>
        </div>
        
    </h:body>
</html>
